<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>MyPetstore</title>
    <link rel="stylesheet" href="../css/jpetstore.css" type="text/css" media="screen" />

</head>
<body>
    <div th:replace="common/top">

    </div>
    <h1><br></h1>

    <div id="crewphoto">


        <div class="img_div">
            <a href="/catalog/viewCategory?categoryId=BIRDS">
                <img class="who" src="../images/bird.png" />
                <div class="mask">
                    <h1>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;BIRDS</h1>
                </div>
            </a>
        </div>


        <div class="img_div">
            <a href="/catalog/viewCategory?categoryId=REPTILES">
                <img class="who" src="../images/Reptiles.png" />
                <div class="mask">
                    <h1>&nbsp;&nbsp;REPTILES</h1>
                </div>
            </a>
        </div>

        <div class="img_div">
            <a href="/catalog/viewCategory?categoryId=FISH">
                <img class="who" src="../images/fish.png" />
                <div class="mask">
                    <h1>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;FISH</h1>
                </div>
            </a>
        </div>
        <div class="img_div">
            <a href="/catalog/viewCategory?categoryId=DOGS">
                <img class="who"  src="../images/dog.png" />
                <div class="mask">
                    <h1>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;DOGS</h1>
                </div>
            </a>
        </div>
        <div class="img_div">
        <!--<a href="/catalog/view">-->
            <img class="who" src="../images/maskLogo.png" />
            <!--<div class="mask">-->
                <!--<h1>&nbsp;&nbsp;Jpetstore</h1>-->
            <!--</div>-->
        <!--</a>-->
        </div>
        <div class="img_div">
            <a href="/catalog/viewCategory?categoryId=CATS">
                <img class="who" src="../images/cat.png" />
                <div class="mask">
                    <h1>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;CATS</h1>
                </div>
            </a>
        </div>
    </div>
    <div>
        <h1><br></h1>
    </div>
    <div>
        <h1><br></h1>
    </div>
    <div>
        <h1><br></h1>
    </div>
    <div>
        <h1><br></h1>
    </div>

    <!--<div id="Main">-->
        <div id="Separator">&nbsp;</div>
    <!--</div>-->



    <div th:replace="common/bottom">

    </div>
</body>
</html>